<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./echarts.min.js"></script>
</head>

<body>
    <div id="main" style="width: 500px; height: 400px;"></div>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('main'));
        var option = {
            title: {
                text: '就业质量'
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            grid: {
                left: '20%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            legend: {
                data: ['C2109A班', 'C2109B班', 'C2109C班']
            },
            xAxis: {
                 type: 'value',
                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                // 标签
                axisLabel: {
                    show: true
                }
            },
            yAxis: {
                name: "C2109班",
                 nameRotate:"2",
                nameLocation: 'center',
                type: 'category',
                axisLine: {
                    show:true
                },
                axisLabel: {
                    show: false
                },
                axisTick: {
                    show: true
                },
            },
            series: [
                {
                    name: 'C2109A班',
                    type: 'bar',
                    barGap: '0%',
                    data: [12005],
                      emphasis: {
                        focus: 'series'
                    },
                },
               {
                    name: 'C2109B班',
                    type: 'bar',
                    barGap: '0%',
                    data: [12010],
                    emphasis: {
                        focus: 'series'
                    },
                },
                {
                    name: 'C2109C班',
                    type: 'bar',
                    barGap: '0%',
                    data: [13005],
                    emphasis: {
                        focus: 'series'
                    },
                },
            ]
        };
        myChart.setOption(option);
    </script>
</body>

</html>